<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <!-- 包含公共顶部文件 -->

</head>

<body>
<!-- 背景视频 -->
<video autoplay loop muted playsinline id="background-video">
    <source th:src="@{/images/main_bg.mp4}" type="video/mp4" />
</video>
<header th:replace="common/top"></header>

<div id="BackLink">
    <a th:href="@{/categoryForm(categoryId=${session.category.catid})}"
       th:text="'Return to ' + ${session.category.name}"></a>
</div>

<div id="Catalog">
    <h2 th:text="${session.product.name}"></h2>

    <table>
        <tr>
            <th>Item ID</th>
            <th>Product ID</th>
            <th>Description</th>
            <th>List Price</th>
            <th> </th>
        </tr>
        <!-- 遍历商品列表 -->
        <tr th:each="item : ${session.itemList}">
            <td>
                <a th:href="@{/itemForm(itemId=${item.itemid})}" th:text="${item.itemid}"></a>
            </td>
            <td th:text="${item.product.productid}"></td>
            <td th:text="${item.attr1 + ' ' +
                              item.attr2 + ' ' +
                              item.attr3 + ' ' +
                              item.attr4 + ' ' +
                              item.attr5 + ' ' +
                              session.product.name}"></td>
            <td th:text="'$' + ${#numbers.formatDecimal(item.listprice, 1, 2)}"></td>
            <td>
                <a th:href="@{/addItemToCart(workingItemId=${item.itemid})}" class="Button">Add to Cart</a>
            </td>
        </tr>
    </table>
</div>

<!-- 包含公共底部文件 -->
<footer th:replace="common/bottom"></footer>
</body>
</html>




